<template>
	<view class="wpprs">
		<view class="box">
			<view class="flix">
				<view class="l">处理时间</view>
				<view class="r"><uni-dateformat :date="content.createTime"></uni-dateformat></view>
			</view>
			<view class="flix">
				<view class="l">定位</view>
				<view class="r">{{ content.location }}</view>
			</view>
			<view class="shuoming">
				<view>处理说明：</view>
				<view class="ctn">{{ content.explain }}</view>
				<view v-if="content.images && content.images != ''" class="imgList">
					<image v-for="item in content.images.split(',')" @click="getImg(item)" :src="item" mode=""></image>
				</view>
			</view>
		</view>
		<seeimg class="mychild" ref="mychild" />
	</view>
</template>

<script>
import { workOrderReport } from '../../api/order.js';
import seeimg from '@/components/xw-seeimg/index';
export default {
	components: { seeimg },
	data() {
		return {
			content: {}
		};
	},
	onLoad(e) {
		workOrderReport({ id: e.id }).then((data) => {
			this.content = data.content;
			console.log(data);
		});
	},
	methods: {
		getImg(val) {
			this.$refs.mychild.onImg(val);
		}
	}
};
</script>

<style lang="less" scoped>
.wpprs {
	height: 100%;
	width: 100%;
	background-image: url('https://junminyiqi.oss-cn-shanghai.aliyuncs.com/flies/d29eccf2-f7be-dbc8-4853-e3b19055825b.png');
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 230upx 30upx 160upx 30upx;
	box-sizing: border-box;
	background-color: #f1f1f1;
	position: fixed;
	left: 0;
	top: 0;
	.box {
		background-image: url('https://junminyiqi.oss-cn-shanghai.aliyuncs.com/flies/6ce52629-e2b1-afe2-4853-40b2d93fcd3c.png');
		background-size: 100%;
		background-repeat: no-repeat;
		height: 756upx;
		padding: 30upx;
		.flix {
			display: flex;
			padding: 20upx;
			.l {
				width: 260upx;
			}
			.r {
				width: 100%;
				text-align: right;
			}
		}
		.shuoming {
			padding: 20upx;
			.ctn {
				padding-top: 20upx;
			}
			.imgList {
				image {
					margin-top: 30upx;
					width: 170upx;
					height: 170upx;
					margin-right: 30upx;
					display: inline-block;
				}
			}
		}
	}
}
</style>
